/* ====================================================== */
/* ====================================================== */
/* ALL CONTROLLER TYPES */

.breadcrumb-wrapper {display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center !important; -webkit-align-items: center !important; flex-shrink:0 !important; -webkit-flex-shrink:0 !important;}
.controller-wrapper {display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-flex: 1 1 auto; flex: 1 1 auto;}

@media (max-width:999px) { 
    .nav-logo-wrapper {display:none;}
    .nav-additionalButtons-wrapper {display: none;}
}

@media (min-width: 768px)  { 
    #appTray {z-index:310;}

}
.dropdown-option:checked + label {background-color:#efefef; pointer-events: none;}


/* ====================================================== */
/* ====================================================== */
/* DISCRETE CONTROLLER - ALL */

@media (max-width:999px) { 
    .discreteController .controller-header {display:none !important;}
}

/* ====================================================== */
/* ====================================================== */
/* DISCRETE CONTROLLER - FLOAT */

@media (min-width: 768px)  { 
    .discreteController .controller-footer {
        position:relative;
        flex-shrink:0 !important; -webkit-flex-shrink:0 !important;
        display: -webkit-box; display: -ms-flexbox; display: flex;
        align-content:center !important; -webkit-align-content:center !important;
        align-items: center !important; -webkit-align-items: center !important;
        font-size: 13pt;
        width: 100vw;
        text-align: center;
        z-index: 8;
        justify-content: space-between !important; -webkit-justify-content: space-between !important;
    }

    .modalController .controller-footer {
        position: relative;
    }

    .menuStyle-float .breadcrumb-wrapper span {opacity: 0.65;}
    .menuStyle-float .breadcrumb-wrapper:hover span {opacity: 1.00;}
    .menuStyle-float.pageStyle-windowed .discreteController .pagesWrapper {width: calc(100% - 150px); height:100%;}
    .menuStyle-float.pageStyle-fullScreen .discreteController .pagesWrapper {width: 100%; height:100%;}
}

@media (max-width:999px) {
    .discreteController .controller-footer .breadcrumb-wrapper {display:none !important;}
    .discreteController .controller-footer .controller-title {display:none !important;}
}

/* ====================================================== */
/* ====================================================== */
/* DISCRETE CONTROLLER - MENUBAR*/

@media (min-width: 1000px)  {
    .menuStyle-menuBar .discreteController .controller-header {width:100vw; min-height:50px; height:50px; padding-left:75px; padding-right:75px; display: flex; align-items: center; justify-content: space-between !important; -webkit-justify-content: space-between !important;}
    .menuStyle-menuBar .discreteController .controller-header {z-index:300;}

    .menuStyle-menuBar #app-button-speakerNotes {z-index:310;}
    .nav-logo-wrapper {max-height:28px; max-width:175px; margin-right:15px;}
    .menuStyle-menuBar.pageStyle-windowed.linearButtonStyle-arrows .discreteController .pagesWrapper {width: calc(100% - 150px); height:calc(100% - 40px);}
    .menuStyle-menuBar.pageStyle-windowed.linearButtonStyle-footer .discreteController .pagesWrapper {width: calc(100% - 40px); height:calc(100% - 20px);}
}



/* ====================================================== */
/* ====================================================== */
/* MODAL CONTROLLER */

.modalController .breadcrumbBtn {background-color:#666;}
.modal-controller-wrapper {max-width:1600px; max-height:1000px;}

@media (min-width: 768px)  { 
    .menuStyle-float .modal-controller-wrapper {width:calc(100vw - 130px); height:calc(100% - 40px);}
    .menuStyle-menuBar .modal-controller-wrapper {width:calc(100vw - 130px); height:calc(100% - 0px);}
    .menuStyle-menuBar .modalController {padding-top:60px; padding-bottom:30px;}
    .modalController .controller-header {min-height:50px; padding-top:5px;}
}

@media (max-width:999px) { 
    .modal-controller-wrapper {width:calc(100vw - 40px); height:calc(100% - 40px);}
    .modalController .breadcrumb-wrapper {display: none;}   
}


/* ============================================== */
/* Alternate Close buttons */
@media (min-width: 768px)  { 
    .modalController-altCloseButton {position:absolute; top:10px; right:10px; color:#fff; width:35px; height:35px; border-radius:50%; border:2px solid rgba(255,255,255,0.3); opacity:0.75; display: -webkit-box; display: -ms-flexbox; display: flex; justify-content: center !important; -webkit-justify-content: center !important; align-items: center !important; -webkit-align-items: center !important;}
    .modalController-altCloseButton:hover {border-color: rgba(255,255,255,1); opacity:1; background-color:rgba(255,255,255,0.2); cursor:pointer;}
}
@media (max-width:999px) {
    .modalController-altCloseButton {display:none;} 
}



.controller-titleIcon-wrapper {min-width:50px; min-height:50px;}

/* ============================================== */
/* Page button locations */
.navBar-vertical {padding:10px 0px;}

/* ============================================== */
/* All page buttons */
.pageNavButton-indexLabel {margin-right:5px; width:18px; height:18px; font-size:9pt; line-height:9pt; border-radius:50%; border:1px solid; display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center !important; -webkit-align-items: center !important; justify-content: center !important; -webkit-justify-content: center !important;}
.navBar-horizontal .toggleButton + label {margin-bottom:2px;}
.navBar-horizontal .toggleColor + label {margin-right:20px; margin-bottom:2px;}
.navBar-vertical .pageNavButton-input + label {width:100%; min-height: 30px; padding-left:10px; padding-right:10px;}




@media (max-width:999px) {
    .navBar-vertical {display:none !important;}
}

@media (min-width: 768px)  {
    .navBar-vertical {width:250px;}
}

.controller-navDropdown-wrapper:not(.open) .controller-navDropdown-options {display:none;}
.controller-navDropdown-selected {padding-left:10px; position:relative; background-color: rgba(255,255,255,0.1); color: #fff; height: 30px; width:100%; display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center !important; -webkit-align-items: center !important;}
.controller-navDropdown-selected:hover {background-color: rgba(255,255,255,0.2); cursor:pointer;}

.controller-navDropdown-arrow {position:absolute; right:0px; top:0px; height:100%; width:30px; border-left:1px solid rgba(255,255,255,0.2); display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center !important; -webkit-align-items: center !important; justify-content: center !important; -webkit-justify-content: center !important;}
.controller-navDropdown-arrow i {font-size:13pt;}

.controller-navDropdown-options {position:absolute; top:10px; left:10px; width:calc(100% - 20px); background-color:#fff; z-index:100;}
.controller-navDropdown-options > label, .controller-navDropdown-options > div {padding:15px 10px; width:100%;}
.controller-navDropdown-options > label:hover, .controller-navDropdown-options > div:hover {background-color:#efefef; cursor:pointer;}




@media (min-width: 1000px) {

    .discreteController {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex: 1 1 auto;
        flex: 1 1 auto;
        width: 100vw;
        position: relative;
        height: 100%;
        flex-wrap:wrap;
    }

    .discreteInner {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex: 1 1 auto;
        flex: 1 1 auto;
        flex-direction: column !important;
        -webkit-flex-flow: column !important;
        position: relative;
        align-items: center !important;
        -webkit-align-items: center !important;
        justify-content: center !important;
        -webkit-justify-content: center !important;
        overflow-x: hidden;

    }

    .menuStyle-float.pageStyle-windowed .discreteController .discreteInner {
        padding-top:40px;
    }

    body.linearButtonStyle-footer .discreteController .controller-footer, .menuStyle-float.pageStyle-windowed .discreteController .controller-footer {
        padding:10px 20px;
    }

    body.linearButtonStyle-footer.menuStyle-float .discreteController .discreteInner {
        padding-bottom:10px;
    }

    body.linearButtonStyle-arrows.menuStyle-menuBar .discreteController .controller-footer {
        display:none !important;
    }


    .discreteController .controller-title {
        padding-right: 40px;
    }

}